<template>
  <div class="headHeacher">
    <h1>班主任工作日志</h1>
    <el-form
      :model="queryMap"
      ref="queryParams"
      label-width="100px"
      :rules="rules"
      label-position="top"
    >
      <el-form-item label="日期" prop="date">
        <el-date-picker
          style="width: 100%"
          v-model="queryMap.date"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="选择日期"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="时间" prop="time">
        <el-time-picker
          style="width: 100%"
          v-model="queryMap.time"
          value-format="HH:mm:ss"
          placeholder="选择时间"
        >
        </el-time-picker>
      </el-form-item>
      <el-form-item label="天气" prop="weather">
        <el-input v-model="queryMap.weather"></el-input>
      </el-form-item>
      <el-form-item label="日志内容" prop="logContent">
        <el-input
          v-model="queryMap.logContent"
          type="textarea"
          rows="4"
        ></el-input>
      </el-form-item>
      <el-form-item style="text-align: center">
        <el-button type="primary" @click="submitForm">提交</el-button>
        <el-button @click="resetForm">重置</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { headTeacherLogAdd } from "@/api/OneStageOneGear/OneStageOneGear.js";
export default {
  name: "HeadHeacher",
  data() {
    return {
      queryMap: {
        date: "",
        time: "",
        weather: "",
        logContent: "",
        trainingClassInfoId: "",
      },
      rules: {
        date: [{ required: true, message: "请选择日期", trigger: "change" }],
        time: [{ required: true, message: "请选择时间", trigger: "change" }],
        weather: [{ required: true, message: "请输入天气", trigger: "blur" }],
        logContent: [
          { required: true, message: "请输入日志内容", trigger: "blur" },
        ],
      },
    };
  },
  created() {
    console.log(this.$route.query.id);
    this.queryMap.trainingClassInfoId = this.$route.query.id;
  },
  methods: {
    submitForm() {
      this.$refs.queryParams.validate(async (valid) => {
        if (valid) {
          let res = await headTeacherLogAdd(this.queryMap);
          if (res.code == 200) {
            this.$message({ message: "添加成功", type: "success" });
          } else {
            this.$message({ message: "添加失败", type: "error" });
          }
        } else {
          return false;
        }
      });
    },
    resetForm() {
      this.$refs.queryParams.resetFields();
    },
  },
};
</script>
<style lang="less" scoped>
.headHeacher {
  padding: 20px;
  h1 {
    text-align: center;
    margin-bottom: 20px;
  }
}
</style>
